<script lang="ts" setup>
import type { QuertListParams } from '@/service/type'

// #region 引入包, 函数和组件
// import { ref } from "vue"
// #endregion

// #region // 使用模块(仓库、路由、父组件参数函数)
interface Props {
  total: number
}
interface Emits {
  queryList: []
}
const form = defineModel<QuertListParams | null>('form')
const props = defineProps<Props>()
const emits = defineEmits<Emits>()
// #endregion

// #region // 变量

// #endregion

// #region // 函数

// #endregion

// #region // 生命周期和vue函数

// #endregion
</script>

<template>
  <el-pagination
    v-model:current-page="form!.page"
    v-model:page-size="form!.pagesize"
    :page-sizes="[5, 10, 15, 20]"
    size="small"
    justify="end"
    background
    layout="sizes, prev, pager, next, jumper, total"
    :total="props.total"
    @size-change="emits('queryList')"
    @current-change="emits('queryList')"
  />
</template>

<style lang="scss" scoped>
.el-pagination {
  margin-top: 10px;
  justify-content: end;
}
</style>
